<template>
  <view class="container">
    <!-- 头部 -->
    <!-- <view class="fixed-con">
      <statusBar></statusBar>
      <view class="go-back">
        <image src="../../static/go-back.svg" @click="goBack"/>
        <view>{{ notificationDetail.data.title }}</view>
        <image class="img-hide" src="../../static/brands-search.png"/>
      </view>
    </view> -->

    <navigationBar :title="notificationDetail.data.title"/>

    <view class="content">
      {{ notificationDetail.data.content }}
    </view>

  </view>
  
  </template>

  <script setup>
    import { reactive,  } from 'vue';  
    import { onLoad } from "@dcloudio/uni-app";	

    const notificationDetail = reactive({
      data:{}
    })

    onLoad(({id,title,content}) => {
      notificationDetail.data = {id,title,content}
    })


    const goBack = () => {
      uni.navigateBack({ delta: 1 })
    }

  </script>

  <style lang="scss" scoped>
    .container{
      width: 100vw;
      height: 100vh;
      background-color: #FFFFFF;
      position: fixed;
      top: 0;
      left: 0;
      /* padding: 0;
      margin: 0; */
      overflow-y: scroll;

      .fixed-con{
        position: fixed;
        top: 0;
        left: 0;
        z-index: 99;
        .go-back{
          width: 750rpx;
          height: 90rpx;
          padding:0 30rpx;
          box-sizing: border-box;
          background-color: white;
          @include flex(row,space-between,center);
          image{
            width: 40rpx;
            height: 40rpx;
          }
          view{
            font-weight: 500;
            font-size: 32rpx;
            color: #333333;
          }
          .img-hide{
            opacity: 0;
          }
        }
      }

      .content{
        flex: 1;
        padding: 40rpx 30rpx;
        margin-top: calc(var(--status-bar-height) + 90rpx);
      }
      

    }
  </style>